<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('试卷预览')" />
</head>
<body class="white-bg">
    <div class="wrapper wrapper-content animated fadeInRight">
        <div class="row">
            <div class="col-sm-12">
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <h5>试卷信息</h5>
                    </div>
                    <div class="ibox-content">
                        <div class="row">
                            <div class="col-sm-6">
                                <label>试卷名称：</label>
                                <span th:text="${examPaper.name}"></span>
                            </div>
                            <div class="col-sm-6">
                                <label>考试时间：</label>
                                <span th:text="${#dates.format(examPaper.startTime, 'yyyy-MM-dd HH:mm:ss')}"></span>
                                <span>至</span>
                                <span th:text="${#dates.format(examPaper.endTime, 'yyyy-MM-dd HH:mm:ss')}"></span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="row">
            <div class="col-sm-12">
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <h5>试卷内容</h5>
                    </div>
                    <div class="ibox-content">
                        <div id="paperContent">
                            <!-- 单选题 -->
                            <div class="question-type" th:if="${#lists.size(radioQuestions) > 0}">
                                <h4>一、单选题（每题<span th:text="${radioScore}"></span>分，共<span th:text="${#lists.size(radioQuestions)}"></span>题）</h4>
                                <div class="question-list" th:each="question,stat : ${radioQuestions}">
                                    <div class="question-item">
                                        <div class="question-title">
                                            <span th:text="${stat.count}"></span>、<span th:text="${question.questionBody}"></span>
                                        </div>
                                        <div class="question-options" th:if="${#lists.size(question.options) > 0}">
                                            <div class="option-item" th:each="option : ${question.options}">
                                                <span th:text="${option.options}"></span>、<span th:text="${option.content}"></span>
                                            </div>
                                        </div>
                                        <div class="question-answer">
                                            <label>答案：</label>
                                            <span th:text="${question.refAnswer}"></span>
                                        </div>
                                        <div class="question-explanation" th:if="${question.explanation != null and question.explanation != ''}">
                                            <label>解析：</label>
                                            <span th:text="${question.explanation}"></span>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <!-- 多选题 -->
                            <div class="question-type" th:if="${#lists.size(checkboxQuestions) > 0}">
                                <h4>二、多选题（每题<span th:text="${checkboxScore}"></span>分，共<span th:text="${#lists.size(checkboxQuestions)}"></span>题）</h4>
                                <div class="question-list" th:each="question,stat : ${checkboxQuestions}">
                                    <div class="question-item">
                                        <div class="question-title">
                                            <span th:text="${stat.count}"></span>、<span th:text="${question.questionBody}"></span>
                                        </div>
                                        <div class="question-options" th:if="${#lists.size(question.options) > 0}">
                                            <div class="option-item" th:each="option : ${question.options}">
                                                <span th:text="${option.options}"></span>、<span th:text="${option.content}"></span>
                                            </div>
                                        </div>
                                        <div class="question-answer">
                                            <label>答案：</label>
                                            <span th:text="${question.refAnswer}"></span>
                                        </div>
                                        <div class="question-explanation" th:if="${question.explanation != null and question.explanation != ''}">
                                            <label>解析：</label>
                                            <span th:text="${question.explanation}"></span>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <!-- 不定项题 -->
                            <div class="question-type" th:if="${#lists.size(indefiniteQuestions) > 0}">
                                <h4>三、不定项题（每题<span th:text="${indefiniteScore}"></span>分，共<span th:text="${#lists.size(indefiniteQuestions)}"></span>题）</h4>
                                <div class="question-list" th:each="question,stat : ${indefiniteQuestions}">
                                    <div class="question-item">
                                        <div class="question-title">
                                            <span th:text="${stat.count}"></span>、<span th:text="${question.questionBody}"></span>
                                        </div>
                                        <div class="question-options" th:if="${#lists.size(question.options) > 0}">
                                            <div class="option-item" th:each="option : ${question.options}">
                                                <span th:text="${option.options}"></span>、<span th:text="${option.content}"></span>
                                            </div>
                                        </div>
                                        <div class="question-answer">
                                            <label>答案：</label>
                                            <span th:text="${question.refAnswer}"></span>
                                        </div>
                                        <div class="question-explanation" th:if="${question.explanation != null and question.explanation != ''}">
                                            <label>解析：</label>
                                            <span th:text="${question.explanation}"></span>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <!-- 主观题 -->
                            <div class="question-type" th:if="${#lists.size(subjectiveQuestions) > 0}">
                                <h4>四、主观题（每题<span th:text="${subjectiveScore}"></span>分，共<span th:text="${#lists.size(subjectiveQuestions)}"></span>题）</h4>
                                <div class="question-list" th:each="question,stat : ${subjectiveQuestions}">
                                    <div class="question-item">
                                        <div class="question-title">
                                            <span th:text="${stat.count}"></span>、<span th:text="${question.questionBody}"></span>
                                        </div>
                                        <div class="question-answer">
                                            <label>答案：</label>
                                            <span th:text="${question.refAnswer}"></span>
                                        </div>
                                        <div class="question-explanation" th:if="${question.explanation != null and question.explanation != ''}">
                                            <label>解析：</label>
                                            <span th:text="${question.explanation}"></span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <th:block th:include="include :: footer" />
    <style>
        .question-type {
            margin-bottom: 30px;
        }
        .question-item {
            margin-bottom: 20px;
            padding: 10px;
            border: 1px solid #eee;
            border-radius: 4px;
        }
        .question-title {
            font-weight: bold;
            margin-bottom: 10px;
        }
        .question-options {
            margin-left: 20px;
            margin-bottom: 10px;
        }
        .option-item {
            margin-bottom: 5px;
        }
        .question-answer, .question-explanation {
            margin-top: 10px;
            padding-top: 10px;
            border-top: 1px dashed #eee;
        }
        .question-answer label, .question-explanation label {
            font-weight: bold;
            color: #666;
        }
    </style>
</body>
</html> 